
<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>root管理员首页</title>
    <!-- <link href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> -->
    <link href="../css/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="../css/global.css" rel="stylesheet">
</head>

<body>
	<!--1.0 narbar -->
	<div   class="fixedNavbar">
       <#include "../navbar.html">
	</div>

    <div class="container-fluid">
    	<!--2.0 left sidebar -->
        <div class="row">
           	<#include "../sidebar.html"> 	

            <!--2.1 main content -->
            <div class="col-md-10">
		            <ul id="myTab" class="nav nav-tabs" role="tablist">
		                <li class="active"><a href="#operators" role="tab" data-toggle="tab">&nbsp;操作员管理</a>
		                </li>
		            </ul>
		            <div class="tab-pane" id="operators">
                        <div class="panel panel-default" id="operatorsList">
                            <div class="panel-heading">
                                <button class="btn btn-primary" type="button" id="btnAddOperator">新增</button>
                                <form class="form-inline" role="form" id="searchForm">
                                    <div class="form-group">
                                      <input type="text" class="form-control" id="keyword" placeholder="姓名/手机">
                                    </div>
                                    <button type="submit" class="btn btn-primary">查询</button>
                                </form>
                            </div>
                            <table class="table table-striped table-bordered table-hover">
                                <thead>
                                    <tr>
                                        <th>姓名</th>
                                        <th>手机</th>
                                        <th>邮箱</th>
                                        <th>类型</th>
                                        <th>状态</th>
                                        <th>注册时间</th>
                                        <th style="text-align:center;">操作</th>
                                    </tr>
                                </thead>
                                <tbody id="dataList">
                                    <tr>
                                        <td>操作员一</td>
                                        <td>13800138000</td>
                                        <td>abc@gmail.com</td>
                                        <td>系统操作员</td>
                                        <td>正常</td>
                                        <td>2017.06.29 10:30</td>
                                        <td style="text-align:center;">
                                        	<a href="#" class="editOperator">修改</a>&nbsp;&nbsp;
                                        	<a href="#" class="delOperator">删除</a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>操作员二</td>
                                        <td>13800138001</td>
                                        <td>def@gmail.com</td>
                                        <td>普通操作员</td>
                                        <td>正常</td>
                                        <td>2017.06.29 10:30</td>
                                        <td style="text-align:center;">
                                        	<a href="#" class="editOperator">修改</a>&nbsp;&nbsp;
                                        	<a href="#" class="delOperator">删除</a>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                            <nav>
							  	<div class="row" style="text-align:center">
				                    <ul id="example" class="pagination">
				                    </ul>
				                </div>
							</nav>
                        </div>
                        <!-- 
                        <div class="panel panel-default" id="addOperatorPanel" style="display:none;">
                            <div class="panel-heading" style = "font-weight:bold;">新增操作员</div>
                            <form id="adminInfoForm" class="form-horizontal" role="form" style="margin-top:16px;">
                                <div class="form-group">
                                    <label for="realName" class="col-sm-2 control-label">用户名</label>
                                    <div class="col-sm-3">
                                        <input type="phone" class="form-control" name="realName" id="realName" placeholder="请输入用户名">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="realName" class="col-sm-2 control-label">姓名</label>
                                    <div class="col-sm-3">
                                        <input type="phone" class="form-control" name="realName" id="realName" placeholder="请输入姓名">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">操作员类型</label>
                                    <div class="col-sm-3">
                                        <select name="operatorType" id="operatorType" class="form-control">
                                            <option value="default">请选择</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="phone" class="col-sm-2 control-label">手机</label>
                                    <div class="col-sm-3">
                                        <input type="phone" class="form-control" name="phone" id="phone" placeholder="请输入手机号码">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="password" class="col-sm-2 control-label">密码</label>
                                    <div class="col-sm-3">
                                        <input type="password" class="form-control" name="password" id="password" placeholder="请输入密码">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="email" class="col-sm-2 control-label">邮箱</label>
                                    <div class="col-sm-3">
                                        <input type="email" class="form-control" name="email" id="email" placeholder="请输入邮箱">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-offset-2 col-sm-3">
                                        <button type="submit" id="btnSaveOperator" class="btn btn-primary">保存</button>
                                    </div>
                                </div>
                            </form>
                        </div> --><!--end 新增操作员-->
                    
                        <!--编辑操作员 -->
                        <div class="panel panel-default" id="editUserPanel" style="display:none;">
                            <div class="panel-heading" style = "font-weight:bold;">编辑操作员</div>
                            <form id="editUserForm" class="form-horizontal" role="form" style="margin-top:16px;">
                                <span id="id" style="display:none"></span>
                                <div class="form-group">
                                    <label for="realname" class="col-sm-2 control-label">姓名</label>
                                    <div class="col-sm-3">
                                        <input type="phone" class="form-control" name="realname" id="realname">
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="mobile" class="col-sm-2 control-label">手机</label>
                                    <div class="col-sm-3">
                                        <input type="mobile" class="form-control" name="mobile" id="mobile" disabled>
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="email" class="col-sm-2 control-label">邮箱</label>
                                    <div class="col-sm-3">
                                        <input type="email" class="form-control" name="email" id="email" disabled>
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">类型</label>
                                    <div class="col-sm-3">
                                        <select name="roletype" id="roletype" class="form-control col-sm-2">
                                            <option value="1" name="root">ROOT</option>
                                            <option value="2" name="normal">公司管理员</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="state" class="col-sm-2 control-label">状态</label>
                                    <div class="col-sm-3">
                                        <input type="state" class="form-control" name="state" id="state" disabled>
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <label for="createTime" class="col-sm-2 control-label">创建时间</label>
                                    <div class="col-sm-3">
                                        <input type="createTime" class="form-control" name="createTime" id="createTime" disabled>
                                    </div>
                                    <span class="col-xs-6 help-block" style="color:red;"></span>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-offset-2 col-sm-3">
                                        <button type="submit" id="btnEditSaveOperator" class="btn btn-primary">保存</button>
                                    </div>
                                </div>
                            </form>
                        </div><!--end 编辑操作员-->
                    </div>
            </div>
        </div><!-- end row-->
    </div>
    <script src="../js/bootstrap/jquery-1.11.1.min.js"></script>
    <script src="../js/bootstrap/bootstrap.min.js"></script>
    <script src="../js/bootstrap-paginator.js"></script>
    <script src="../js/_x_ctr_location-1.0.min.js"></script>
    <script src="../js/jquery.iframe-transport.js"></script>
    <script src="../js/jquery.validate.js"></script>
    <script src="../js/jquery.tablesorter.min.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/common/pageConfig.js?v=12312432"></script>
    <script src="../js/common/pageUtil.js"></script>
	<script src="../js/util.js"></script>
	<script src="../js/sha1.js"></script>
	<script src="../js/bootstrap-dialog.min.js"></script>
    
    
    <script>
    	$(function(){
        	//加载数据
        	var params= {
       			pageNo:Page.getConstant('PAGE_NO'),
       			pageSize:Page.getConstant('PAGE_SIZE'),
        	};
        	loadData(params);
            
        	//模糊搜索
        	$("#searchForm").validate({
				rules: {
					keyword: {
						required : true,
					    minlength: 2,
					    maxlength: 100
					}
				},
				messages: {
					keyword: {
						required : "名称不能为空",
						minlength : "名称太短",
						maxlength : "名称太长,请检查"
					}
				},
				submitHandler : function(form) {
					params.keyword = $("#keyword").val();
				 	loadData(params);
				}
			});
        	
        	//处理修改界面的保存按钮
        	$.validator.addMethod("isLandlineNum", function(value, element){     
		        var pattern =/^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{1,}))?$/;  
		        if(value != '') {
		        	if(!pattern.exec(value)) {
		        		return false;
		        	}
		        }
		        return true;   
		    });

            $.validator.addMethod("isPhoneNum", function(value, element, arg){
                var pattern = /(^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$)|(^0{0,1}1[3|4|5|6|7|8|9][0-9]{9}$)/;
                if(pattern.test(value)) { 
                    return true; 
                }
                return false;
            }, "Value must be a phone num");

			$("#editUserForm").validate({
				rules: {
					realname: {
						required: true,
					    minlength: 2,
						maxlength: 20
					},
                    roletype: {
                        required: true,
                    },
				},
				messages: {
					realname: {
						required: "姓名不能为空",
					    minlength: "请输入不小于2个字符",
						maxlength: "请输入不超过20个字符"
					},
					roletype: {
						required: "请选择类型",
					},
				},
				submitHandler : function(form) {
					debugger;
					$("#register-hint").text("正在运行,请稍后...").show();
					var realname = $("#realname").val();
					var roletype = $("#roletype").find("option:selected").html()=='ROOT'?'ROOT':'COMPANY_MANAGER';
					// alert('roletype是:' + roletype);

					var url = "/eoip/web/updateUser";
					var params = {  
									userid: $('#id').val(),
                                    realname: realname,
                                    roletype: roletype,
                                    state:$('#state').attr('val')
								};
					
				 	common.post(url, params, function (data) {
                        var data = jQuery.parseJSON(data);
                        if (data.code == "1") {
                            BootstrapDialog.show({
                                title: '<font color="green">保存结果</font>',
                                message: '保存成功',
                                buttons: [{
                                    label: '知道了',
                                    action: function(dialog) {
                                        dialog.close();
                                        location.href = '/eoip/web/operator_manage';
                                    }
                                }]
                            });
                        } else {
                        	alert(data.info);
                        }//end if
                    });//end common post
				}
			});
        	
            //处理修改按钮事件
            $("#dataList").on("click",".editUser",function(){
            	
            	//1. hide & show trick
            	$("#operatorsList").hide();
            	$("#editUserPanel").show();
                // $("#addOperatorPanel").hide();
                
            	//2. fill edit user form 
            	var url = "/eoip/web/getUserById";
            	var params= {
            		userid: $(this).parent().prevAll(".managerId").html(),
            	};
            	common.post(url, params, function(data){
            		data = $.parseJSON(data);
            		if(data.code == 1) {
                        $('#id').val(data.user.id);
            			$('#realname').val(data.user.realname);
                		$('#mobile').val(data.user.mobile);
                		$('#email').val(data.user.email);
                        //$('#roletype').val(data.user.roletype=='ROOT'?'系统管理员':'普通操作员');
                        var temp = data.user.roletype=='ROOT'?'root':'normal';
                        $("#roletype").find("option[name='"+ temp + "']").attr("selected",true);
                        $('#state').val(data.user.state=='0'?'正常':(data.user.state=='1'?'邮箱未激活':'冻结'));
                        $('#state').attr('val', data.user.state);
                        // alert('state是'+ $('#state').attr('val') );
                		$('#createTime').val(data.user.createTime);
            		} else {
            			alert(data.info);
            		}
            	});
            });

            //处理删除按钮事件
            $("#dataList").on("click",".delUser",function(){
                
                var url = "/eoip/web/getUserById";
                var params= {
                    userid: $(this).parent().prevAll(".managerId").html(),
                };
                common.post(url, params, function(data){
                    data = $.parseJSON(data);
                    if(data.code == 1) {
                        $('#id').val(data.user.id);
                        $('#realname').val(data.user.realname);
                        $('#mobile').val(data.user.mobile);
                        $('#email').val(data.user.email);
                        //$('#roletype').val(data.user.roletype=='ROOT'?'系统管理员':'普通操作员');
                        var temp = data.user.roletype=='ROOT'?'root':'normal';
                        $("#roletype").find("option[name='"+ temp + "']").attr("selected",true);
                        $('#state').val(data.user.state=='0'?'正常':(data.user.state=='1'?'邮箱未激活':'不可用'));
                        $('#state').attr('val', data.user.state);
                        // alert('state是'+ $('#state').attr('val') );
                        $('#createTime').val(data.user.createTime);
                    } else {
                        alert(data.info);
                    }
                });
            });
            
    		
    	});
    	
    	//分页插件options
    	var options = {
		  	bootstrapMajorVersion: 3, //版本
            currentPage: Page.getConstant('PAGE_NO'), //当前页数
            totalPages: Page.getConstant('PAGE_SIZE'), //总页数
            itemTexts: function (type, page, current) {
              switch (type) {
                case "first":
                  return "首页";
                case "prev":
                  return "上一页";
                case "next":
                  return "下一页";
                case "last":
                  return "末页";
                case "page":
                  return page;
              }
            },//点击事件，用于通过Ajax来刷新整个list列表
            onPageChanged:onPageChanged
        };//end option
        
        function onPageChanged(event, oldPage, newPage){
        	loadData({
    			pageNo:newPage,
    			pageSize:Page.getConstant('PAGE_SIZE'),
    		});
        }
        
        function fillData(data){
        	$.each(data,function(index,item){
        		var html="";
        		html=html+
        			'<tr >'+
        			'<td class="managerId" style="display:none;">'+item.id+'</td>'+
        				'<td class="realname">'+item.realname+'</td>'+
        				'<td class="mobile">'+item.mobile+'</td>'+
            			'<td class="email">'+item.email+'</td>'+
            			'<td>'+(item.roletype=='ROOT'?'ROOT':'公司管理员') +'</td>'+
            			'<td>'+( item.state=='0'?'正常':(item.state=='1'?'邮箱未激活':'冻结') ) +'</td>'+
            			'<td>'+ item.createTime + '</td>'+
            			'<td style="text-align:center;">' + 
            				'<a href="#"' +  'class="editUser btn btn-success btn-xs">修改</a>&nbsp;&nbsp;'+
            				'<a href="#"' +  'class="delUser btn btn-danger btn-xs">删除</a>&nbsp;&nbsp;</td>'+
        			'</tr>';
        			$("#dataList").append(html);
			});
        }
        
        function loadData(params){
        	$("#dataList").empty();
            common.post('/eoip/web/getAllUsersByPage',params,function(data){
            	   data = $.parseJSON(data);
             	   var pageCount = data.totalPage;
         		   var currentPage = data.pageNo;
         		   
         		   options.currentPage=currentPage;
         		   options.totalPages=pageCount;
         		   
         		   fillData(data.dataList);
         	       $('#example').bootstrapPaginator(options);
             });
        }//end loadData
    </script>
</body>
</html>
